<template>
    <div>
        <nut-form label-position="top" ref="formData1Ref" :model-value="formData1" :rules="rules">
            <nut-form-item label="新密码" prop="new_password">
                <nut-input v-model="formData1.new_password" placeholder="输入新密码" :type="eyeOpen1 ? 'text' : 'password'">
                    <template #right>
                        <iconpark-icon @click="eyeOpen1 = !eyeOpen1" color="#A8A8CA"
                            :icon-id="eyeOpen1 ? 'show' : 'hide'" size="1.3rem" class="mr-12"></iconpark-icon>
                    </template>
                </nut-input>
            </nut-form-item>
            <nut-form-item label="确认新密码" prop="new_password_confirm">
                <nut-input v-model="formData1.new_password_confirm" placeholder="重新输入新密码"
                    :type="eyeOpen2 ? 'text' : 'password'">
                    <template #right>
                        <iconpark-icon @click="eyeOpen2 = !eyeOpen2" color="#A8A8CA"
                            :icon-id="eyeOpen2 ? 'show' : 'hide'" size="1.3rem" class="mr-12"></iconpark-icon>
                    </template>
                </nut-input>
            </nut-form-item>
        </nut-form>
        <div>
            <nut-button class="submit" @click="submit">提交</nut-button>
        </div>

    </div>
</template>
<script setup>
import { ref } from 'vue';
import { verifyPassword } from '@/utils/validateTools';
import commonHooks from "../../commonHooks";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
const props = defineProps({
    formData: {
        type: Object,
        default: () => ({})
    },
    type: {
        type: String,
        default: ''
    },
})
const eyeOpen1 = ref(false)
const eyeOpen2 = ref(false)
const formData1Ref = ref(null)
const formData1 = ref({
    new_password: '',
    new_password_confirm: '',
})
const { passwordValidator, changePassword } = commonHooks()


const passwordValidator1 = (val) => {
    if (!val) {
        return Promise.reject(t('home_page_enterPassword'))
    } else if (!verifyPassword(val)) {
        return Promise.reject(t('home_page_passwordFormatIncorrect'))
    } else if (val != formData1.value.new_password) {
        return Promise.reject(t('home_page_passwordsInconsistent'))
    } else {
        return Promise.resolve()
    }
}


const rules = {
    new_password: [
        { validator: passwordValidator },
    ],
    new_password_confirm: [
        { validator: passwordValidator1 },
    ]
}


// 发送
const submit = () => {
    formData1Ref.value?.validate().then(({ valid, errors }) => {
        if (valid) {
            const params = {
                modify_type: props.type == 'email' ? 3 : 2,
                ...formData1.value,
                ...props.formData
            }

            changePassword(params, 2, props.type)
        } else {
            console.warn('error:', errors)
        }
    })



}





</script>